<html>
    <head>
        <title>Heaven Job</title>
        <link rel="stylesheet" type="text/css" href="<?php echo css_url().'user_group3/header.css'?>">
        <link rel="stylesheet" type="text/css" href="<?php echo css_url().'notification/notification.css'?>">
        <link rel="stylesheet" type="text/css" href="<?php echo css_url().'page_sections.css'?>">
        <script src="<?php echo js_url()."jquery.min.js"?>"> </script>
        <script>
        var notification;
            
        $(document).ready(function(){
            $("ul.user-panel-container").css('visibility','hidden');
            $(".user-header-container").on('click',function(){
                $("ul.user-panel-container").css('visibility','hidden');
                $("#notification-holder-panel").empty();
            });
            
            $("a#user-account-link").on('click',function(e){
                e.stopPropagation();
                var val = $("ul.user-panel-container").css('visibility');
                if(val == 'hidden'){
                    $("ul.user-panel-container").css('visibility','');
                }
                else{
                    $("ul.user-panel-container").css('visibility','hidden');
                }
            });
            
            $("#notification-trigger").on('click',function(e){
                e.stopPropagation();
                $.get("<?php echo site_url().'/user_group2/notification/get_notification' ?>", function(data){
                    $("#notification-holder-panel").empty();
                    $("#notification-holder-panel").html(data);
                });
            });
      
                                 
            IntervalFunctions = function(){
                Noti_Handler();
            }
            
            
            function Noti_Handler(){
                
                $.ajax({
                    url : '<?php echo site_url().'/user_group2/notification/num_new_not'?>',
                    type: 'post',
                    success: function(data){
                        $('#new-notification-number').text(data);
                        if(data > 0){
                            $('#notification-trigger').attr('light','on');
                            $('#new-notification-number').css('display','block');
                        }
                        else{
                            $('#notification-trigger').attr('light','off');
                            $('#new-notification-number').css('display','none');
                        }
                    }
                })
            }
            IntervalFunctions();
            setInterval(IntervalFunctions,10000);
        });
        </script>
        
        <?php
        // Report simple running errors
        error_reporting(E_ERROR | E_PARSE);      
        ?>
    </head>
    
    <body>
        <section class="user-header-container">
            <div class="user-header-content" >
                <div class="header-logo-image">
                    <image src="http://i.imgur.com/ADDNadn.png"/>
                </div>
                
                <?php if($UserInfo){?>
                <div class="user-header-profile">
                    <div class="user-header-profile-information">
                        <a id="user-account-link" href="#profile"><?php echo $UserInfo['UserEmail']?></a>
                    </div>
                    
                    <a class='user-avatar' href="#">
                        <image id="user-avatar" src="<?php echo user_avatar_link();?>" style="float:right;width:50px; height:50px"/>
                    </a>
                    <ul class="user-panel-container" >
                        <li class="user-panel-element-container"><a href="<?php echo site_url().'/user_group2/account'?>" class="user-panel-element">User Page</a></li>
                        <li class="user-panel-element-container"><a href="<?php echo site_url().'/signout'?>" class="user-panel-element">Logout</a></li>
                    </ul>
                    
                    <div class="notification-container">
                        <div class="notification-icons-container">
                            <ul>
                                <li>
                                    <span id="new-notification-number" class="notired"></span>
                                    <a id="notification-trigger" class="showmesgreq spritimg" light="off" title="Click to View Notifications">ws</a>
                                </li>
                            </ul>
                        </div>
                        <div id="notification-holder-panel" class="pop-up-panel" style="z-index: 1">

                        </div>
                    </div>
                </div>

                <?php }  else { ?>
                <div class="user-header-profile-nolog">
                    <a class="button-login" href='#'>Login</a>
                    <a class="button-signup" href='#'>Sign Up</a>
                    
                </div>
                 <?php } ?>
                <div class="header-nav-bar-container" >
                    <ul class="header-nav-bar">
                        <li><a href="<?php echo site_url();?>" class="header-nav-header">Home</a></li>
                        <li><a href="<?php echo site_url()."/user_group2/posts"?>" class="header-nav-header">Manage Posts</a></li>
                        <li><a href="<?php echo site_url()."/user_group2/applicants"?>" class="header-nav-header">Applicants</a></li>
                        <li><a href="#" class="header-nav-header">About Us</a></li>
                    </ul>
                </div>
                
            </div>
            
   
        </section>
     